<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/common/base.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Insert title here</title>

<style type="text/css">
 
        body{ padding:5px; margin:0; padding-bottom:15px;}
        #layout1{  width:100%;margin:0; padding:0;  } 
        .l-page-top{ height:40px; background:#ffffff; margin-bottom:3px;}
        h4{ margin:20px;}
.font_css 
{
      margin:0px;
      padding:0px;
      font-family:"微软雅黑","黑体","宋体";
	  color:#ffffff;
      font-size:15px;
      height:30px;
            
}
.font_css_a
{
      margin:0px;
      padding:0px;
      font-family:"微软雅黑","黑体","宋体";
	  color:#8f8f8f;
      font-size:15px;
      height:30px;
            
}
</style>

<script type="text/javascript">
var ligergrid = null;

$(document).ready(function(){//初始化
	reloadAnnualSelect();
	againDataGridLoad();
});

function againDataGridLoad(){
	var annualId = $("#annualId").val();
	ligergrid = $("#groupOrReportGrid").ligerGrid({
        columns: [
          { display: '报表说明名称', name: 'templateExplainName', width:'25%'},
          { display: '所属报表', name: 'templateName', width:'25%'},
          { display: '报表说明类型', name: 'explainType', width:'15%',render:function(row){
    			  var valTypeMap = {'1':'条目','2':'数字','3':'文本'};
            	  return valTypeMap[row.explainType + ''];
          }},
          { display: '顺序', name: 'orderId', width:'9%'},
          {
              display: '操作', isAllowHide: false,width:'25%',
              render: function (row)
              {
                  var html = '';
                	  html += '<a href="#" onclick="templateExplainUpdate(\'' + row.id + '\')" class="update-btn">编辑</a>||';
                	  html += '<a href="#" onclick="templateExplainDelete(\'' + row.id + '\')" class="update-btn">删除</a>||';
                	  html += '<a href="#" onclick="templateCustomized(\'' + row.id + '\')" class="update-btn">报表说明定制</a>';
                  return String.format(html,row.id);
              }
          }

        ],
        url: '${ctx}/reportTemplateExplainController/explainListData/'+annualId,
        pageSize: 10, sortName: 'orderId',
        width: '99%', height: '95%', rownumbers:true,
        pageParmName:'pageNum',
        pagesizeParmName:'pageSize',
        sortnameParmName:'sortname',
        sortorderParmName:'sortorder',
        alternatingRow:true,
	});
}

function reloadAnnualSelect(){
	var annualId = $("#annualId").val();
	$.ajax({
		url:'${ctx}/rptAnnualController/queryAllAnnualSelect',
		type:'POST',
		cache:false,
		success:function(data){
			var treeSelectIdOptions = "";
		    $.each(data,function(idx,item){
		    	if(item.annualId == annualId){
		    		treeSelectIdOptions += "<option value='"+item.annualId+"' selected>" + item.name + "</option>";
		    	}else{
		    		treeSelectIdOptions += "<option value='"+item.annualId+"'>" + item.name + "</option>";
		    	}
		    	
			});
		    $("#treeSelectId option").remove();
		    treeSelectIdFirst="<option value='0'>请选择</option>";
		    $("#treeSelectId").append(treeSelectIdFirst).append(treeSelectIdOptions);
		}
	});
}

function loadTreeByAnnualId(){
	var treeSelectId = $("#treeSelectId").val();
	$("#annualId").val(treeSelectId);
	againDataGridLoad();
}

function onNewReportExplain(){
	var annualId = $("#annualId").val();
	if(annualId == '0' || annualId == ''){
		alert("请选择年度版本");
		return false;
	}
	$.layer({
	    type: 2,
	    maxmin: true,
	    shadeClose: true,
	    title: '新增报表说明信息',
	    shade: [0.1,'#000000'],
	    shift:'top',
	    offset: [($(window).height() / 20)+'px',''],
	    area: ['600px', '400px'],
	    iframe: {src: '${ctx}/reportTemplateExplainController/preCreateExplain/'+annualId}
	}); 
}

function templateExplainUpdate(id){
	var annualId = $("#annualId").val();
	$.layer({
	    type: 2,
	    maxmin: true,
	    shadeClose: true,
	    title: '修改报表说明信息',
	    shade: [0.1,'#000000'],
	    shift:'top',
	    offset: [($(window).height() / 20)+'px',''],
	    area: ['600px', '400px'],
	    iframe: {src: '${ctx}/reportTemplateExplainController/preUpdateExplain/'+id}
	}); 
}

function templateExplainDelete(id){
	layer.confirm('是否删除',function(){
		$.ajax({
			url:'${ctx}/reportTemplateExplainController/deleteRptExplain/'+id,
			type:'POST',
			cache:false,
			success:function(data){
				if(data == 'success'){
					layer.alert('操作成功',9);
					location.reload();
				}else{
					layer.alert('操作失败');
				}
			}
		});
	});
}

//弹出报表说明设计器
function templateCustomized(id){
	var annualId = $("#annualId").val();
	parent.$.layer({
		type: 2,
	    maxmin: true,
	    shadeClose: true,
	    title: '报表说明设计',
	    shade: [0.1,'#000000'],
	    shift:'top',
	    offset: [($(window).height() /100)+'px',''],
	    area: ['1350px', '650px'],
	    iframe: {src: '${ctx}/reportTemplateExplainController/preReportExplainDesign/'+id+'/'+annualId}
    });
	//window.open('${ctx}/reportDesignController/preReportDesign/'+templateId);
}
</script>
</head>
<body>
<input type="hidden" id="annualId" value="${annualId}"></input>
<div id="layout1" style="height: 98%;">
      <div position="center" title="报表说明详细列表">
			<div  style="text-align: center;">
				选择报表版本:<select id="treeSelectId" style="width:150px;margin-left:5px;" class="treeSelectClass" onchange="loadTreeByAnnualId();"></select>
			</div>
      	<div style="margin-right:15px;margin-top:5px;padding:5px;border:0px solid green;position:relative;">
			<input type="button" class="btn btn-info" value="新增报表批注" onclick="onNewReportExplain();" id="newGroupReport"/>
		</div>
      	<div id="groupOrReportGrid" style="margin:5px; padding:0;height:90%;width:100%" ></div>
		<div style="right:5px;padding:0px; bottom:0px; position:absolute;">
		<!--<div style="text-align: right;margin-right:10px;line-height:20px; bottom:0; left:0;font-size:small; padding:6px; position:absolute;">-->
		</div>
      </div>  
</div> 

</body>
</html>